<template>
  <page-frame>
    <div class="apply-examine">
      <div class="toptitle">
        <div class="left">补助审核</div>
        <div class="right">
          <!--<div class="btns">-->
            <!--<el-button @click="memberFile" class="lightGreenBtn">会员建档</el-button>-->
          <!--</div>-->
        </div>
      </div>
      <div class="borderT"></div>
      <div class="apply-examine-main">
        <div class="input">
          <el-row class="query">
            <el-col style="width: 130px;">
              <div class="input-item">
                <el-select style="width:90%!important;" @change="selectItem" @clear="clearItem" v-model="fileId"
                           clearable placeholder="请选择项目">
                  <el-option
                    v-for="item in fileList"
                    :label="item.fileName"
                    :value="item.fileId">
                  </el-option>
                </el-select>
              </div>
            </el-col>
            <el-col :span="6">
              <div class="input-item" v-show="fileId=='1'">
                <el-input v-model="searchData.memberName" placeholder="请输入机构名称">
                </el-input>
              </div>
              <div class="input-item" v-show="fileId=='2'">
                <el-input v-model="searchData.phone" placeholder="请输入法人名称">
                </el-input>
              </div>
              <div class="input-item" v-show="fileId=='3'">
                <el-select v-model="searchData.lidList" placeholder="请选择申请类型">
                  <el-option
                    v-for="item in nursingGradeOptions"
                    :label="item.lname"
                    :value="item.lid">
                  </el-option>
                </el-select>
              </div>
            </el-col>
            <el-col :span="2">
              <el-button class="query lightGreenBtn" @click="loadTableData">搜索</el-button>
            </el-col>
          </el-row>
        </div>
        <div class="tabs">
          <el-table
            :data="tableData"
            border
            highlight-current-row
            style="width: 100%">
            <el-table-column
              prop="memberNo"
              label="机构名称"
              min-width=""
            >
            </el-table-column>
            <el-table-column
              prop="memberName"
              label="法人名称"
              min-width=""
            >
            </el-table-column>
            <el-table-column
              prop="sex"
              label="联系方式"
            >
            </el-table-column>
            <el-table-column
              prop="age"
              label="详细地址"
              width=""
            >
            </el-table-column>
            <el-table-column
              prop="phone"
              label="建筑面积"
              min-width=""
            >
            </el-table-column>
            <el-table-column
              prop="lid"
              label="标准床位"
              min-width="50"
            >
            </el-table-column>
            <el-table-column
              prop="dateCheckin"
              width=""
              label="申请类型"
            >
            </el-table-column>
            <el-table-column
              prop="urgentContactName"
              label="申请资助合计"
              min-width=""
            >
            </el-table-column>
            <el-table-column
              prop="operating"
              label="操作"
              width="150"
            >
              <template scope="scope">
                <el-button type="text" size="small" @click.stop="QRCode(scope.row.memberId)">查看</el-button>
                <el-button type="text" size="small" @click.stop="passFU(scope.row.memberId)">通过</el-button>
                <el-button type="text" size="small" @click.stop="stop(scope.row.memberId)">拒绝</el-button>
              </template>
            </el-table-column>

          </el-table>
          <!--查看-->
          <el-dialog title="建设与运营补贴" class="build" v-model="QRCodeStatus" size="tiny" :close-on-click-modal="false">
              <el-form ref="form" :model="form" label-width="100px">
              <el-row :gutter="2">
                <el-col :span="8">
                  <el-form-item label="机构名称">
                    <el-input v-model="form.orgName" disabled></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="开业时间">
                    <el-date-picker
                      v-model="form.openingDate"
                      type="date"
                      disabled>
                    </el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="法人代表">
                    <el-input v-model="form.name" disabled></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="16">
                  <el-form-item label="详细地址">
                    <el-input v-model="form.legalrepResentative" disabled></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="联系电话">
                    <el-input v-model="form.phone" disabled></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="社会福利机构批准证书编号">
                    <el-input v-model="form.welfareNo" disabled></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="民办非企业登记证书编号">
                    <el-input v-model="form.enterpriseNo" disabled></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="建筑面积">
                    <el-input v-model="form.areaOfStructure" disabled></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="标准床位数">
                    <el-input v-model="form.bedNums" disabled></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <div>职工情况(总数)</div>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="6">
                  <el-form-item label="管理人员">
                    <el-input v-model="form.admin" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="服务人员">
                    <el-input v-model="form.service" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="其他人员">
                    <el-input v-model="form.others" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="合计">
                    <el-input v-model="form.sum" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <div>收住老人情况(总数)</div>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="6">
                  <el-form-item label="自费老人">
                    <el-input v-model="form.atTheoldMan" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="三无老人">
                    <el-input v-model="form.threeMan" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="五保老人">
                    <el-input v-model="form.fiveMan" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="合计">
                    <el-input v-model="form.peopleSum" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <div>申请资助人数(总数)</div>
                </el-col>
              </el-row>
              <el-row class="yue">
                <el-col :span="4">
                  <el-form-item label="1月">
                    <el-input v-model="form.month1" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="4">
                  <el-form-item label="2月">
                    <el-input v-model="form.month2" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="4">
                  <el-form-item label="3月">
                    <el-input v-model="form.month3" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="4">
                  <el-form-item label="4月">
                    <el-input v-model="form.month4" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="4">
                  <el-form-item label="5月">
                    <el-input v-model="form.month5" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="4">
                  <el-form-item label="6月">
                    <el-input v-model="form.month6" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row class="yue">
                <el-col :span="4">
                  <el-form-item label="7月">
                    <el-input v-model="form.month7" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="4">
                  <el-form-item label="8月">
                    <el-input v-model="form.month8" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="4">
                  <el-form-item label="9月">
                    <el-input v-model="form.month9" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="4">
                  <el-form-item label="10月">
                    <el-input v-model="form.month10" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="4">
                  <el-form-item label="11月">
                    <el-input v-model="form.month11" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="4">
                  <el-form-item label="12月">
                    <el-input v-model="form.month12" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="6">
                  <el-form-item label="合计">
                    <el-input v-model="form.monthSum" disabled>
                      <template slot="append">人</template>
                    </el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <span>郑重声明:以上信息完全真实，且申请年度内我机构无严重责任事故和重大服务纠纷，无侵害入住老年服务对象合法合法权益现象。特此申请资助</span>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="申请人">
                    <el-input v-model="form.apply" disabled></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="申请年度" >
                    <el-date-picker
                      v-model="form.applyYear"
                      type="date"
                      disabled>
                    </el-date-picker>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="QRCodeStatus = false">取 消</el-button>
                <el-button type="primary" @click="QRCodeStatus = false">确 定</el-button>
              </div>
          </el-dialog>
          <!--通过-->
          <el-dialog title="通过" class="pass" :visible.sync="pass" size="tiny" :close-on-click-modal="false">
              <el-form ref="passData" :model="passData" label-width="100px">
                <el-row>
                  <el-col :span="8">
                    <div>符合资助人数</div>
                  </el-col>
                </el-row>
                <el-row class="yue">
                  <el-col :span="4">
                    <el-form-item label="1月">
                      <el-input v-model="passData.month1">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item label="2月">
                      <el-input v-model="passData.month2">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item label="3月">
                      <el-input v-model="passData.month3">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item label="4月">
                      <el-input v-model="passData.month4">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item label="5月">
                      <el-input v-model="passData.month5">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item label="6月">
                      <el-input v-model="passData.month6">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row class="yue">
                  <el-col :span="4">
                    <el-form-item label="7月">
                      <el-input v-model="passData.month7">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item label="8月">
                      <el-input v-model="passData.month8">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item label="9月">
                      <el-input v-model="passData.month9">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item label="10月">
                      <el-input v-model="passData.month10">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item label="11月">
                      <el-input v-model="passData.month11">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item label="12月">
                      <el-input v-model="passData.month12">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="6">
                    <el-form-item label="合计">
                      <el-input v-model="passData.monthSum">
                        <template slot="append">人</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="8">
                    <el-form-item label="资助金额">
                      <el-input v-model="passData.financeSum">
                        <template slot="append">元</template>
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="批核时间">
                      <el-date-picker
                        v-model="passData.applyTime"
                        type="date"
                        placeholder="选择批核时间">
                      </el-date-picker>
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="pass = false">取 消</el-button>
                <el-button type="primary" @click="pass = false">确 定</el-button>
              </div>
          </el-dialog>
          <!--拒绝-->
          <el-dialog title="拒绝" :visible.sync="stopRefusal" size="tiny" :close-on-click-modal="false">
            <el-form>
              <el-form-item label="拒绝原因">
                <el-col :span="20">
                  <el-input
                    type="textarea"
                    v-model="refuseReason"
                    style="width:100%!important"
                  >
                  </el-input>
                </el-col>
              </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
              <el-button @click="stopRefusal = false">取 消</el-button>
              <el-button type="primary" @click="stopRefusal = false">确 定</el-button>
            </div>
          </el-dialog>
          <div class="pagination">
            <div class="block">
              <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChangePage"
                :current-page="currentPage"
                :page-size="10"
                layout="total, prev, pager, next"
                :total="total">
              </el-pagination>
            </div>
          </div>
        </div>
      </div>
    </div>
  </page-frame>
</template>

<script>
  import fileApi from '../../service/member/fileApi';
  import servicePlanApi from '../../service/serManagement/servicePlanApi';
  export default {
    data() {
      return {
        refuseReason:"",
        QRCodeStatus: false,
        pass:false,
        stopRefusal:false,
        fileId: 1,
        dateCheckin: [],
        form: {
          orgName: '上海久龄家园',
          openingDate: '2016-10-23',
          name: '陈旧领',
          legalrepResentative: '上海市长宁区金银花小区1号楼2楼',
          phone: "13608525812",
          welfareNo: "00000031号",
          enterpriseNo: "沪ICP备08064497号",
          areaOfStructure: '43平方米',
          bedNums:"5张",
          admin: '11',
          service: '21',
          others: '22',
          sum: '54',
          atTheoldMan: "12",
          threeMan: "120",
          fiveMan: '12',
          peopleSum: '132',
          month1: '12',
          month2: '8',
          month3: '3',
          month4: '22',
          month5: "23",
          month6: "2",
          month7: '14',
          month8: '8',
          month9: '22',
          month10: '9',
          month11: '12',
          month12: '11',
          monthSum: "100",
          apply: "国槐",
          applyYear: "2016-10-23",
        },
        passData:{
          month1: '',
          month2: '',
          month3: '',
          month4: '',
          month5: "",
          month6: "",
          month7: '',
          month8: '',
          month9: '',
          month10: '',
          month11: '',
          month12: '',
          monthSum: "",
          financeSum: "",
          applyTime: '',
        },
        searchData: {
          memberName: '',
          phone: '',
          lidList: [],
          dateCheckinBegin: "",
          dateCheckinEnd: "",
          type: null,
        },
        nursingGradeOptions: [{
          lid: 0,
          lname: "全部"
        },{
          lid: 1,
          lname: "运营补贴"
        }, {
          lid: 2,
          lname: "一次性补贴",
        }, {
          lid: 3,
          lname: "建筑补贴",
        }],
        fileList: [{
          fileId: 1,
          fileName: "机构名称"
        }, {
          fileId: 2,
          fileName: "法人名称",
        }, {
          fileId: 3,
          fileName: "申请类型",
        }],
        tableData: [{
          memberNo:'上海久龄家园',
          memberName:"陈旧领",
          sex:"13608525812",
          age:"上海市长宁区金银花小区1号楼2楼",
          phone:"43平方米",
          lid:"5张",
          dateCheckin:"民办机构运营补贴",
          urgentContactName:"100人",
          type:"1",
        },{
          memberNo:'上海芳草地家园',
          memberName:"王建国",
          sex:"15001745233",
          age:"上海市长宁区中山公园西路100弄3号楼",
          phone:"46平方米",
          lid:"3张",
          dateCheckin:"一次性建筑补贴",
          urgentContactName:"200人",
          type:"2",
        },{
          memberNo:'上海夕阳养老院',
          memberName:"张健",
          sex:"15001742599",
          age:"上海市浦东新区碧波路230号3楼",
          phone:"12平方米",
          lid:"12张",
          dateCheckin:"民办机构运营补贴",
          urgentContactName:"150人",
          type:"1",
        },{
          memberNo:'上海绿地养老院',
          memberName:"孟浩人",
          sex:"18001742366",
          age:"上海市长宁区绿地小区1号楼2楼",
          phone:"43平方米",
          lid:"5张",
          dateCheckin:"民办机构运营补贴",
          urgentContactName:"111人",
          type:"1",
        }],
        total: 4,
        currentPage: 1,
      }
    },
    methods: {
      init(){
//        this.loadTableData();
//        this.getCareLevel();
//        this.judgeType();
      },
      /**
       * 分页查询
       */
      loadTableData(){

      },
      /**
       * 判断会员类型
       */
      judgeType(){
        let self = this;
        for(let i = 0;i<self.tableData.length;i++){
          switch(self.tableData[i].type){
            case 1:
              self.tableData[i].memberType = "外部会员";
              self.tableData[i].checkInStatus = 0;
              break;
            case 2:
              self.tableData[i].memberType = "入住会员(待审核)";
              self.tableData[i].checkInStatus = 1;
              break;
            case 0:
              self.tableData[i].memberType = "入住会员";
              self.tableData[i].checkInStatus = 2;
              break;
          }
        }
      },
      /**
       * 会员建档
       */
      memberFile(){//way:1代表新建档案
        this.$router.push({name: "memberFileInfo", params: {memberId: 0, way: 1}});
      },
      /**
       * 申请入住
       */
      checkIn(val){//入住
        this.$router.push({name: "checkInProcess01", params: {memberId: val, currentType: 'submitApply'}});
      },
      /**
       * 制定服务计划
       */
      makePlan(val){
        this.$router.push({name: "externalMemPlan", params: {memberObj: val}});
      },
      /**
       * 修改
       */
      edit(val){//修改 way:2代表编辑档案
        this.$router.push({name: "memberFileInfo", params: {memberId: val, way: 2}});
      },
      /**
       * 查看
       */
      QRCode(){
        this.QRCodeStatus = true;
      },
      /**
       * 通过
       */
      passFU(){
        this.pass = true;
      },
      /**
       * 拒绝
       */
      stop(){
        this.stopRefusal = true;
      },

      /**
       * 双击查看详情
       */
      handleCurrentChange(val) {//way:0代表查看档案
        this.$router.push({name: "memberFileInfo", params: {memberId: val.memberId, way: 0}});
      },
      /**
       * 选择项目
       */
      selectItem(){
        //清空选项
        this.searchData.memberName = '';
        this.searchData.phone = '';
        this.searchData.lidList = [];
        this.dateCheckin = [];
        this.searchData.type = null;
      },
      /**
       * 清空按钮触发
       */
      clearItem(){
        this.selectItem();
      },
      /**
       * 获得照护等级
       */
      getCareLevel(){
        let self = this;
        servicePlanApi.getCareLevel().then(
          (response) =>{
            self.nursingGradeOptions = response.data.data;
          }
        )
        ;
      },
      /**
       * 分页相关函数
       */
      handleSizeChange(val) {
//        console.log(`每页 ${val} 条`);
      },
      handleCurrentChangePage(val) {
        this.currentPage = val;
//        console.log(`当前页: ${val}`);
//        this.loadTableData();
      },
    },
    mounted: function () {
      this.init();
    },

  }
</script>
<style>

  .input .btns {
    float: none !important;
    display: inline-block;
  }



  .input input {
    display: inline-block;
  }

  .el-pagination {
    margin-right: 0 !important;
    padding-right: 0 !important;
  }


  .apply-examine .apply-examine-main .build .el-dialog--tiny{
    width:60%!important;
    height: 475px;
    overflow-y: scroll;
  }
  .apply-examine .apply-examine-main .pass .el-dialog--tiny{
    width:60%!important;
  }
  .apply-examine .apply-examine-main .build .el-dialog__body{

  }
  .apply-examine .apply-examine-main .el-dialog  .el-input-group{
    display: inline-table!important;
  }
  /*.apply-examine .apply-examine-main .el-dialog .yue label.el-form-item__label,.apply-examine .apply-examine-main .el-dialog .yue .el-form-item__content{*/
    /*width: 50px!important;*/
  /*}*/
  .apply-examine .apply-examine-main .el-dialog .yue .el-input{
    width: 120%!important;
  }
  .apply-examine .apply-examine-main .el-dialog .yue .el-input.is-disabled{
    width: 120%!important;
  }
  .apply-examine .apply-examine-main .el-dialog .yue label.el-form-item__label{
    width: 60px!important;
  }
  .apply-examine .apply-examine-main .el-dialog .yue .el-form-item__content{
    margin-left: 60px!important;
  }
  /*.apply-examine .apply-examine-main .el-dialog .yue label.el-form-item__label{*/
    /*padding:11px 0;*/
  /*}*/
</style>

